<template>
  <div>
    <!-- <img src="http://localhost:9991/Upload/Tables/App_Appointment/201911240828293464/h52.jpg"> -->
    <div class="upload-container">
      <div class="upload-item">
        <div style="font-size: 13px;float: left;line-height: 32px;">委托函：</div>
        <VolUpload
     
          :max-file="1"
          :excel="true"
          :url="url"
          :upload-before="uploadBefore"
          :upload-after="uploadAfter"
          :wthfileInfo="wthfileInfo"
          :on-change="onChange"
          style="float:left;width:75%;"
        >
        </VolUpload>
        <div style="font-size: 13px;color: red;clear: both;">说明：文件格式必须为.pdf，文件最大不能超过10M（文件名称中必须带有“委托函”的字样）</div>
      </div>
      
    </div>

  </div>
</template>
<script>
import VolUpload from "@/components/basic/wthVolUpload.vue";
export default {
  components: { VolUpload },
  data() {
    return {
      url: "/api/zm_data_record/uploadobs",
      model: true,
      wthfileInfo: [],
      loadingStatus: false
    };
  },
  methods: {
    removeFile(index) {
      this.wthfileInfo.splice(index, 1);
    },
    uploadBefore1(files) {
      this.wthfileInfo.splice(0);
      for (let index = 0; index < files.length; index++) {
        const element = files[index];
        this.wthfileInfo.push({ name: element.name });
      }
      return true;
    },
    uploadAfter1(result, files) {
      if (!result.status) return true;
      // this.wthfileInfo.forEach(x => {
      //   x.path = result.data;
      // });
      return true;
    },
    fileClick(index, file) {
      if (
        !file.path &&
        file.name.indexOf("/") == -1 &&
        file.name.indexOf("\\") == -1
      ) {
        return this.$Message.error({ duration: 5, content: "请先上传此文件" });
      }
      //从api服务器下载
      if (!this.base.checkUrl(file.path)) {
        this.dowloadFile(
          this.http.ipAddress +
            "api/App_Appointment/DownLoadFile?path=" +
            file.path +
            file.name,
          file.name,
          {"":this.http}
        );
        return;
      }
      //从远程下载
      this.$refs.downFile.href = file.path || file.name;
      this.$refs.downFile.setAttribute("download", "download");
      this.$refs.downFile.click();
    },
    getFileNames(files) {
      let arr = [];
      for (let index = 0; index < files.length; index++) {
        const element = files[index];
        arr.push(element.name);
      }
      return arr.join(",");
    },
    uploadBefore(files) {
      var rest = true;
      var filename = this.getFileNames(files);
      if (filename.includes("委托函") == false) {
        rest = false;
        this.$alert("请选择相关委托函！", "消息提示", {
          confirmButtonText: "确定",
          callback: (action) => {
            this.wthfileInfo = [];
          },
        });
      }
     // console.log("上传前的文件:" + this.getFileNames(files));
      return rest;
    },
    uploadAfter(result, files) {
      var rest = true;
      var filename = this.getFileNames(files);
      if (filename.includes("委托函") == false) {
        rest = false;
        this.$alert("请选择相关委托函！", "消息提示", {
          confirmButtonText: "确定",
          callback: (action) => {
            this.wthfileInfo = [];
          },
        });
      } else {
        const maxSize = 30 * 1024 * 1024; // 10MB
        if (files[0].size > maxSize) {
          rest = false;
          this.wthfileInfo = [];
          this.$message.error("文件大小超过了30MB的限制，请重新上传！");
        } else {
          rest = true;
        }
      }
      return rest;
    },
    onChange(files) {
  //    console.log("选择的文件:" + +this.getFileNames(files));
      return true;
    },
    dowloadFile(url, fileName) {
      this.base.dowloadFile(url, fileName, {
        Authorization: this.$store.getters.getToken()
      });
    }
  }
};
</script>
<style lang="less" scoped>
.upload-container {
  max-height: 160px;
  display: flex;
  .upload-item {
    flex: 1;
    padding: 20px;
  }
}
</style>
